/** 页面滚动或移动端滑动事件 **/
let initial = parseInt($('#online').css('top'));
let initialMobile = parseInt($('.mobile-about-i').css('top'));
window.onscroll = function () {
    let scrollTop1 = scroll().top;
    slowAnimate(document.querySelector('.mobile-about-i'), {'top': initialMobile + scrollTop1}, 35);
    let scrollTop2 = $('html').scrollTop();
    slowAnimate(document.querySelector('#online'), {'top': initial + scrollTop2}, 35);
};

$(function(){
    //导航栏--移动端--每个页面都会加载
    $('.mobile-nav-i').click(function () {
        if ($('.modal-box-ul').css('display') === 'none') {
            $('.modal-box-ul').fadeIn();
            $('.mask').fadeIn();
            $(document.body).css({
                "overflow-y": "hidden"
            });
        } else {
            $('.modal-box-ul').fadeOut();
            $('.mask').fadeOut();
            $(document.body).css({
                "overflow-y": "auto"
            });
        }
    });
    //导航栏--移动端--每个页面都会加载
    $('.mask').click(function () {
        $('.modal-box-ul').fadeOut();
        $('.mask').fadeOut();
    });

})

//在线留言
let pcInput = document.querySelectorAll('.pc-input');
$('.onlineMessage').click(function () {
    let top = $('html').scrollTop();
    $('.mask2-form').css('top', top + 50);
    $('.mask2-form').eq(0).fadeIn();
    $('.mask2').eq(0).fadeIn();
    for (let i = 0; i < pcInput.length; i++) {
        pcInput[i].onblur = function () {
            console.log(pcInput[i]);
            if (!pcInput[i].value) {
                pcInput[i].nextElementSibling.nextElementSibling.classList.remove('d-none');
                pcInput[i].nextElementSibling.classList.add('d-none');
            } else {
                pcInput[i].nextElementSibling.classList.remove('d-none');
                pcInput[i].nextElementSibling.nextElementSibling.classList.add('d-none');
            }
        };
    }
    $('.mask2-form-close').click(function () {
        for (let i = 0; i < pcInput.length; i++) {
            pcInput[i].value = '';
            pcInput[i].nextElementSibling.nextElementSibling.classList.add('d-none');
            pcInput[i].nextElementSibling.classList.add('d-none');
        }
        $('.mask2').fadeOut();
        $(this).parent().fadeOut();
    })
});

$('.mask2-form').find('.btn-primary').click(function () {
    let flag = 0;
    for (let j = 0; j < pcInput.length; j++) {
        if (pcInput[j].value) {
            flag++;
        }
    }
    if (flag === 3) {
        $('.mask2-form').fadeOut('normal', function () {
            $('.mask2-right').eq(0).fadeIn();
            $('.mask2-right').eq(0).find('button').click(function () {
                $('.mask2').eq(0).fadeOut();
                $(this).parent().fadeOut();
            })
        });
    } else {
        for (let i = 0; i < pcInput.length; i++) {
            if (!pcInput[i].value) {
                pcInput[i].nextElementSibling.nextElementSibling.classList.remove('d-none');
            }
        }
    }
});

//移动端--在线留言
let mbInput = document.querySelectorAll('.mb-input');
$('.mobile-about-i').click(function () {
    let topValue = scroll().top;
    $('.mobile-mask2-window').css('top', topValue + 15).fadeIn();
    $('.mobile-mask2').fadeIn();
    for (let i = 0; i < mbInput.length; i++) {
        mbInput[i].onblur = function () {
            if (!mbInput[i].value) {
                mbInput[i].nextElementSibling.nextElementSibling.classList.remove('d-none');
                mbInput[i].nextElementSibling.classList.add('d-none');
            } else {
                mbInput[i].nextElementSibling.classList.remove('d-none');
                mbInput[i].nextElementSibling.nextElementSibling.classList.add('d-none');
            }
        };
    }
    $('.mask2-form-close').click(function () {
        for (let i = 0; i < mbInput.length; i++) {
            mbInput[i].value = '';
            mbInput[i].nextElementSibling.nextElementSibling.classList.add('d-none');
            mbInput[i].nextElementSibling.classList.add('d-none');
        }
        $('.mobile-mask2').fadeOut();
        $(this).parent().fadeOut();
    })
});

$('.mobile-mask2-window').find('.btn-primary').click(function () {
    let flag = 0;
    for (let j = 0; j < mbInput.length; j++) {
        if (mbInput[j].value) {
            flag++;
        }
    }

    if (flag === 3) {
        $('.mobile-mask2-window').fadeOut('normal', function () {
            $('.mobile-mask2-right').fadeIn();
            $('.mobile-mask2-right').find('button').click(function () {
                $('.mobile-mask2').fadeOut();
                $(this).parent().fadeOut();
            })
        });
    } else {
        for (let i = 0; i < mbInput.length; i++) {
            if (!mbInput[i].value) {
                mbInput[i].nextElementSibling.nextElementSibling.classList.remove('d-none');
            }
        }
    }
});

//在线留言--点击背景消失
$('.mask2').click(function () {
    for (let i = 0; i < pcInput.length; i++) {
        pcInput[i].value = '';
        pcInput[i].nextElementSibling.nextElementSibling.classList.add('d-none');
        pcInput[i].nextElementSibling.classList.add('d-none');
    }
    $('.mask2-form').fadeOut();
    $(this).fadeOut();
    $('.mask2-right').fadeOut();
    $(document.body).css({
        "overflow-y": "auto"
    });
});

/**
 * 地理位置
 */
function getGeolocation() {
    var jd = null;
    var wd = null;
    if (navigator.geolocation) {
        //getCurrentPosition(成功的回调函数,失败的回调函数,可选项)      获得当前位置
        navigator.geolocation.getCurrentPosition(successCallback, errorCallback);
    } else {
        console.log("亲,你的浏览器不支持获取位置");
    }

    function successCallback(position) {
        //coords    坐标
        //longitude 经度
        jd = position.coords.longitude;

        //latitude  纬度
        wd = position.coords.latitude;

        console.log(wd + "," + jd);
        console.log("获取位置成功");
        var map = new AMap.Map('container', {
            center: [jd, wd],
            layers: [//只显示默认图层的时候，layers可以缺省
                new AMap.TileLayer()//高德默认标准图层
            ],
            zoom: 20
        });
        // 创建一个 Marker 实例：
        var marker = new AMap.Marker({
            position: new AMap.LngLat(jd, wd),   // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
            title: '当前位置'
        });
        // 将创建的点标记添加到已有的地图实例：
        map.add(marker);
    }

    function errorCallback() {
        document.querySelector('#container').innerHTML = "获取失败!请刷新页面重试"
    }
}

/**
 * 缓动动画
 * @param ele   元素节点
 * @param json  键值对
 * @param fn    后续函数
 */
function slowAnimate(ele, json, speed, fn) {
    if (!speed) {
        speed = 15;
    }
    clearInterval(ele.timer);
    ele.timer = setInterval(function () {
        var flag = true;
        for (var k in json) {
            var leader;
            if (k === "opacity") {
                leader = getStyle(ele, k) * 100 || 1;
            } else {
                leader = parseInt(getStyle(ele, k)) || 0;
            }
            var step = (json[k] - leader) / 10;
            step = step > 0 ? Math.ceil(step) : Math.floor(step);
            leader += step;
            if (k === "opacity") {
                ele.style[k] = leader / 100;
                ele.style["filter"] = "alpha(opacity = " + leader + ")";
            } else if (k === "zIndex") {
                ele.style[k] = json[k];
            } else {
                ele.style[k] = leader + "px";
            }
            if (Math.abs(json[k] - leader) > Math.abs(step)) {
                flag = false
            }
        }
        if (flag) {
            for (var k in json) {
                if (k === "opacity") {
                    ele.style[k] = json[k] / 100;
                    ele.style["filter"] = "alpha(opacity = " + json[k] + ")";
                } else {
                    ele.style[k] = json[k] + "px";
                }
            }
            clearInterval(ele.timer);
            if (fn) {
                fn();
            }
        }
    }, speed)
}

/**
 * 返回样式属性值
 * @param ele   元素节点
 * @param attr  样式属性
 * @returns {样式属性值}
 */
function getStyle(ele, attr) {
    if (window.getComputedStyle) {
        return window.getComputedStyle(ele, null)[attr];
    }
    return ele.currentStyle[attr];
}

/**
 * 获得屏幕可视区域宽/高
 * @returns {可视区域宽/高}
 */
function client() {
    if (window.innerWidth !== undefined) {
        return {
            "width": window.innerWidth,
            "height": window.innerHeight
        }
    } else if (document.compatMode === "CSS1Compat") {
        return {
            "width": document.documentElement.clientWidth,
            "height": document.documentElement.clientHeight
        }
    } else {
        return {
            "width": document.body.clientWidth,
            "height": document.body.clientHeight
        }
    }
}

/**
 * 获取 卷走的长度
 * @returns {卷走的长度}
 */
function scroll() {
    if (window.pageYOffset !== undefined) {
        return {
            "top": window.pageYOffset,
            "left": window.pageXOffset
        }
    } else if (document.compatMode === "CSS1Compat") {
        return {
            "top": document.documentElement.scrollTop,
            "left": document.documentElement.scrollLeft
        }
    } else {
        return {
            "top": document.body.scrollTop,
            "left": document.body.scrollLeft
        }
    }
    //精简版
    // return {
    //     "top":window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop,
    //     "left":window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft
    // }
}